<template>
  <div id="app">
    <el-container>
      <el-aside width="200px">
        <el-menu default-active="2" @select="handleMenuSelect">
          <el-menu-item index="1">用户管理</el-menu-item>
          <el-menu-item index="2">仓库管理</el-menu-item>
        </el-menu>
      </el-aside>
      <el-main>
        <component :is="currentComponent"></component>
      </el-main>
    </el-container>
  </div>
</template>


<script>
import UserManagement from './components/UserManagement.vue';
import WarehouseManagement from './components/WarehouseManagement.vue';

export default {
  components: {
    UserManagement,
    WarehouseManagement,
  },
  data() {
    return {
      currentComponent: 'UserManagement',
    };
  },
  methods: {
    handleMenuSelect(index) {
      if (index === '1') {
        this.currentComponent = 'UserManagement';
      } else if (index === '2') {
        this.currentComponent = 'WarehouseManagement';
      }
    },
  },
};
</script>

<style>
</style>